<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="lib/vue-2.4.0.js"></script>
    <script src="lib/vue-router-3.0.1.js"></script>
</head>
<body>
<div id="app">
    <input type="text" v-model="getfirst"/>+
    <input type="text" v-model="gettwo"/>=
    <input type="text" v-model="getthree"/>

</div>
<script>
    var vm = new Vue({
        el:'#app',
        data:{
            getfirst:'',
            gettwo:'',
            getthree:''
        },
        watch:{  //使用这个属性 watch   可以监视  data  中指定数据的变化   然后触发这个   watch  中对应的  function  处理函数
            'getfirst':function (newdata) {
                console.log('监视到了第一个值的变化')
                this.getthree = newdata +  '---' + this.gettwo
            },
            'gettwo':function (newdata) {
                console.log('监视到了第二个值的变化')
                this.getthree = this.getfirst +  '---' + newdata
            }
        }
    })
</script>
</body>
</html>